#header{
    >.header-center{
        width: var(--container-width);
        margin:  0 auto;
        display: flex;
        justify-content: space-between;
        line-height: 56px; ;

        div{
            display: inline-block;
        }

        >span{
            color:#666 ;
        }

        >.right{

            >.course{
                position: relative;
	            display: inline-block;

                &:hover{
                    >.all_course{
                        display: block;
                    }
                }
             

                >.all_course{
                    display: none;
                    width: 842px;
	                border: 1px solid #eee;
	                position: absolute;
	                z-index: 9999;
	                top: 56px;
	                box-shadow: 4px 7px 16px rgba(0,0,0,0.5);
	                left: -370px;
	                border-radius: 8px;
	                padding: 20px;
	                background: #fff;	

                    >.list{
                        float: left;
	                    width: 200px;
	                    border-right: 1px solid #f2f2f2;
                        >li{
                            line-height: 32px;
                            font-size: 14px;
	                        padding: 0 20px;
	                        margin-left: 31px;


                        }

                        >.title{
                            display: block;
	                        width: 140px;
	                        border-bottom: 2px solid #33bae6;
	                        font-weight: bold;
	                        float: none;
	                        height: 38px;
	                        line-height: 38px;
	                        margin-bottom: 10px;
                        }
                    }
                }
            }

            >.r1{

                a{
                    margin: 0 15px;
                    width: 200px;
                }
            }
        }
    }
}